<!-- 单个地址解析并标记 -->
<!-- 需要数据：酒店的经纬度（创建地图）、名称（调整位置）、所属城市-->

<template>
  <div id="container"></div>
</template>

<script>
import { getHotel } from '../api/map';
export default {
  name: "mapSGJX",
  data() {
    return {
        lng: 0.0,
        lat: 0.0,
        hotel: "",
        city: "",

      // lng: 104.14402278576799,
      // lat: 30.634690652292694,
      // hotel: "7天酒店(火车东站地铁站店)",
      // city: "成都市",
    };
  },
  props:{message:String},
  methods: {
    //测试无误
    SingleJX() {
      var self = this;
      var map = new BMapGL.Map("container");
      //   console.log(self.lng);
      //   console.log(self.lat);
      map.centerAndZoom(new BMapGL.Point(self.lng, self.lat), 12);
      //创建地址解析器实例
      var myGeo = new BMapGL.Geocoder();
      // 将地址解析结果显示在地图上，并调整地图视野
      myGeo.getPoint(
        self.hotel,
        function(point) {
          if (point) {
            map.centerAndZoom(point, 16);
            map.addOverlay(new BMapGL.Marker(point, { title: self.hotel }));
          } else {
            alert("您选择的地址没有解析到结果！");
          }
        },
        self.city
      );
    },
    getParams(){
      //传入酒店名称--lhj
      /**
       * this.hotel = 组件传入
       */
      this.hotel = this.message;
      // console.log(this.message);
      //测试数据
      // this.hotel = "全季酒店(成都新会展中心店)";
    },
  },

  mounted() {
    //初始化参数
    this.getParams();
    //请求数据
    getHotel(this.hotel).then((res)=>{
      this.lng = res.data.addx;
      this.lat = res.data.addy;
      this.city = res.data.city;
    })
    //单个地址解析
    this.SingleJX();
  },
};
</script>

<style>
#container {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
</style>
